import React, { Component } from 'react'
/**
 * 父组件在调用子组件的地方，添加一个自定义的属性，
 * 属性的值是一个函数，函数的默认参数就是子组件需要传递给父组件的值
 * 
 * 在子组件的某一个事件内部， 通过 this.props.自定义的事件属性(参数) 
 * 或者 props.自定义的事件属性(参数)  完成传值
 */
class Title extends Component {
  state = {
    num: 1000
  }
  render () {
    return (
      <>
        <h1>标题-{ this.props.name }</h1>
        <button onClick = { () => {
          this.props.fn(this.state.num)
        } }>发送阅读量给父组件</button>
      </>
    )
  }
}

class App extends Component {
  getData = (val) => {
    console.log(val)
  }
  render() {
    return (
      <>
        <Title name="title" fn = { this.getData }></Title>
      </>
    )
  }
}
export default App
